<ui:composition template="/WEB-INF/template.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://xmlns.jcp.org/jsf/core"
                xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">

    <ui:define name="head">
        <title>Notification</title>
        <f:metadata>
            <f:viewParam name="eventId" value="#{notificationBean.eventId}" />
            <f:viewParam name="participant" value="#{notificationBean.participantUsername}" />
            <f:viewParam name="timestamp" value="#{notificationBean.timestamp}" />
            <f:viewAction action="#{notificationBean.loadNotification()}" />
        </f:metadata>
    </ui:define>
    <ui:define name="content">
        <h1>Notification Details</h1>
        <p:outputPanel rendered="#{notificationBean.viewable}">
            <h:form>
                <h:panelGrid columns="2">
                    <p:outputLabel value="Event Name: " />
                    <h:link value="#{notificationBean.notification.event.name}" outcome="eventDetails">
                        <f:param name="id" value="#{notificationBean.notification.event.eventId}" />
                    </h:link>
                    <p:outputLabel value="Modification date: " />
                    <p:calendar value="#{notificationBean.notification.notificationPK.timestamp}"
                                pattern="dd/MM/yyyy HH:mm" disabled="true" />
                    <p:outputLabel value="Title: " />
                    <p:inputText value="#{notificationBean.notification.title}" readonly="true" />
                    <p:outputLabel value="Message: " />
                    <p:inputTextarea value="#{notificationBean.notification.text}" readonly="true" />
                    <p:commandButton value="Confirm Participation" action="#{notificationBean.confirm()}" />
                    <p:commandButton value="Cancel Participation" action="#{notificationBean.cancel()}" />
                </h:panelGrid>
            </h:form>
        </p:outputPanel>
        <p:outputPanel rendered="#{!notificationBean.viewable}">
            <p:outputLabel value="Sorry, you cannot see the details of this notification." />
        </p:outputPanel>
    </ui:define>
</ui:composition>